<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core " %>
<%@include file="./../../../taglibs.jsp"%>
<html>
<head>
    <%@include file="./../../../header.jsp"%>
</head>

	<body class="body">
		
		<div class="section">
			<div class="wrapper-md">
	       		<h1 class="fl" id="title">积分管理</h1>
	       		<div class="fr">
	       			<div class="def-btn-group">
	       				<button class="def-btn def-btn-primary" onclick="window.location.href='add.html'"><i class="gopng gopng_page"></i> 添加</button>
	       			</div>
	       		</div>
	        </div>

			<div class="section-content">
				<form class="layui-form filterDiv" action="" method="">
					<div class="layui-inline">
						<label for="">社工名称：</label>
						<div class="layui-input-inline">
						    <input name="" type="text" class="layui-input" />
				      	</div>
					</div>
					<div class="layui-inline">
						<label for="">储蓄所名称：</label>
						<div class="layui-input-inline">
						    <select name="">
						        <option value="0">全部</option>
						        <option value="1">交通运输部</option>
						        <option value="2">厅机关</option>
						        <option value="3">厅直单位</option>
						        <option value="4">地市交通局</option>
					      	</select>
				      	</div>
					</div>
					<div class="layui-inline">
						<label for="">账号：</label>
						<div class="layui-input-inline">
						    <input name="" type="text" class="layui-input" />
				      	</div>
					</div>
					<button type="submit" class="def-btn def-btn-normal ml20"><i class="gopng gopng_search"></i> 查询</button>
				</form>
				<div class="layui-form">
					<table class="layui-table table-center table-blue" >
						<colgroup>
							<col width="50" />
						</colgroup>
						<thead>
							<tr>
								<th><input type="checkbox" name="" lay-skin="primary" lay-filter="allChoose"></th>
								<th>社工姓名</th>
								<th>账号</th>
								<th>积分合计</th>
								<th>储蓄所名称</th>
								<th>操作</th>
							</tr>
						</thead>
						<tbody>
							<tr>
								<td><input type="checkbox" name="" lay-skin="primary"></td>
								<td>张某</td>
								<td>HPXC-D-10103</td>
								<td>17</td>
								<td>和平新村社区</td>
								<td>
									<div id="tableHandleBtn" class="def-breadcrumb">
										<span class="detial" onclick="window.location.href='detial.html'">查看</span>
										<span class="edit" onclick="window.location.href='edit.html'">编辑</span>
										<span class="add" onclick="add()">添加</span>
										<span class="exec" onclick="exec()">兑换</span>
									</div>
								</td>
							</tr>
						
						</tbody>
					</table>
					
					<div class="text-right">
						<div id="page"></div>
					</div>
				</div>
			</div>
		</div>


		
		<!--新增弹框-->
		<script type="text/template" id="addNew_modal">
			<div class="modal_content modal_label_width">
				<form class="layui-form">
			        <div class="layui-form-item">
				        <label class="layui-form-label">服务内容</label>
				        <div class="layui-input-block">
				            <input type="text" name="" lay-verify="required" class="layui-input">
				        </div>
			        </div>
			        <div class="layui-form-item">
				        <label class="layui-form-label">服务时间</label>
				        <div class="layui-input-block">
				            <input type="text" name="" class="layuiTime layui-input" lay-verify="required">
				        </div>
			        </div>
			        <div class="layui-form-item">
				        <label class="layui-form-label">可获积分</label>
				        <div class="layui-input-block">
				            <input type="text" name="" lay-verify="required" class="layui-input">
				        </div>
			        </div>
				</form>
			</div>
		</script>
		<!--/ 新增弹框-->
		
		<!--兑换积分-->
		<script type="text/template" id="edit_modal">
			<div class="modal_content modal_label_width">
				<form class="layui-form">
					<div class="layui-form-item">
						<label for="">兑换内容</label>
						<div class="layui-input-inline">
						    <select name="" >
						        <option value="0">兑换物品</option>
						        <option value="1">兑换服务</option>
					      	</select>
				      	</div>
					</div>
					<div class="layui-form-item">
				        <label class="layui-form-label">兑换积分</label>
				        <div class="layui-input-block">
				            <input type="text" lay-verify="required" class="layui-input">
				        </div>
			        </div>
			        <div class="layui-form-item">
				        <label class="layui-form-label">兑换时间</label>
				        <div class="layui-input-block">
				            <input type="text"  lay-verify="required" class="layui-input layuiTime">
				        </div>
			        </div>
				</form>
			</div>
		</script>
		<!--/ 兑换积分-->




		<script type="text/javascript">
			
			var form = layui.form,
				layer = layui.layer,
				layedit = layui.layedit,
				laydate = layui.laydate;
				
				
				form.render();
				
				
			//添加
			function add(){
				layui.layer.open({
					type: 1,
					skin: 'layui-layer-demo', //样式类名
					anim: 2,
					title: '添加',
					closeBtn: 1, //不显示关闭按钮
					shadeClose: false, //开启遮罩关闭
					area: ['500px', '350px'],
					btn: ['确定'],
					yes: function(index, layero) { //按钮【按钮一】的回调
						alert('点击了确定');
						var formData = $(layero).find('form').serialize();
						$.ajax({
							type:"post",
							url:"",
							data:formData
							async:true,
							suceess:function(res){
								//layer.msg('添加成功。。', {icon: 6});
								layer.close(index)		//关闭方法
							},
							error:function(err){
								layer.msg('添加失败。。', {icon: 5});
							}
						});
					},
					content: $('#addNew_modal').html(),
					success:function(){
						form.render();
						laydate.render({
						  elem: '.layuiTime' //指定元素
						});	
					}
				})
			}
			//兑换
			function exec(){
				layui.layer.open({
					type: 1,
					skin: 'layui-layer-demo', //样式类名
					anim: 2,
					title: '兑换',
					closeBtn: 1, //不显示关闭按钮
					shadeClose: false, //开启遮罩关闭
					area: ['500px', '350px'],
					btn: ['确定'],
					yes: function(index, layero) { //按钮【按钮一】的回调
						alert('点击了确定')
						var formData = $(layero).find('form').serialize();
						$.ajax({
							type:"post",
							url:"",
							data:formData
							async:true,
							suceess:function(res){
								//layer.msg('兑换成功。。', {icon: 6});
								layer.close(index)		//关闭方法
							},
							error:function(err){
								layer.msg('兑换失败。。', {icon: 5});
							}
						});
					},
					content: $('#edit_modal').html(),
					success:function(){
						form.render();
						laydate.render({
						  	elem: '.layuiTime' //指定元素
						});	
					}
				})
			}
			
			//分页
			layui.laypage.render({
				elem: 'page' //注意，这里的 test1 是 ID，不用加 # 号
				,count: 50 //数据总数，从服务端得到
			    ,skin: '#1E9FFF'
			    ,skip: true
			});

		</script>

	</body>
</html>